
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
  "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<html xmlns="http://www.w3.org/1999/xhtml">
  <head>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
    
    <title>The MathJax.Ajax Object &mdash; MathJax v1.0 documentation</title>
    <link rel="stylesheet" href="../_static/mj.css" type="text/css" />
    <link rel="stylesheet" href="../_static/pygments.css" type="text/css" />
    <script type="text/javascript">
      var DOCUMENTATION_OPTIONS = {
        URL_ROOT:    '../',
        VERSION:     '1.0',
        COLLAPSE_INDEX: false,
        FILE_SUFFIX: '.html',
        HAS_SOURCE:  true
      };
    </script>
    <script type="text/javascript" src="../_static/jquery.js"></script>
    <script type="text/javascript" src="../_static/underscore.js"></script>
    <script type="text/javascript" src="../_static/doctools.js"></script>
    <link rel="top" title="MathJax v1.0 documentation" href="../index.html" />
    <link rel="up" title="The MathJax API" href="index.html" />
    <link rel="next" title="The MathJax.Message Object" href="message.html" />
    <link rel="prev" title="The MathJax.Hub Object" href="hub.html" /> 
  </head>
  <body>
    <div class="related">
      <h3>Navigation</h3>
      <ul>
        <li class="right" style="margin-right: 10px">
          <a href="../genindex.html" title="General Index"
             accesskey="I">index</a></li>
        <li class="right" >
          <a href="message.html" title="The MathJax.Message Object"
             accesskey="N">next</a> |</li>
        <li class="right" >
          <a href="hub.html" title="The MathJax.Hub Object"
             accesskey="P">previous</a> |</li>
        <li><a href="../index.html">MathJax v1.0 documentation</a> &raquo;</li>
          <li><a href="index.html" accesskey="U">The MathJax API</a> &raquo;</li> 
      </ul>
    </div>  

    <div class="document">
      <div class="documentwrapper">
        <div class="bodywrapper">
          <div class="body">
            
  <div class="section" id="the-mathjax-ajax-object">
<span id="api-ajax"></span><h1>The MathJax.Ajax Object<a class="headerlink" href="#the-mathjax-ajax-object" title="Permalink to this headline">¶</a></h1>
<p>The <cite>MathJax.Ajax</cite> structure holds the data and functions for handling
loading of external modules.  Modules are loaded only once, even if
called for in several places.  The loading of files is asynchronous,
and so the code that requests an external module will continue to run
even when that module has not completed loading, so it is important to
be aware of the timing issues this may cause.  Similarly, creating or
loading stylesheets is an asynchronous action.  In particular, all
actions that rely on the file or stylesheet having been loaded must be
delayed until after the file has been downloaded completely.  This is
the reason for the large number of routines that take callback
functions.</p>
<p>Any operation that could cause the loading of a file or stylesheet
must be synchronized with the rest of the code via such callbacks.
Since processing any mathematics might cause files to be loaded (e.g.,
little-used markup might be implemented in an extension that is loaded
only when that markup is used), any code that dynamically typesets
mathematics will need to be structured to use callbacks to guarantee
that the mathematics has been completely processed before the code
tries to use it.  See the <a class="reference internal" href="../synchronize.html#synchronization"><em>Synchronizing with MathJax</em></a>
documentation for details on how to do this properly.</p>
<div class="section" id="properties">
<h2>Properties<a class="headerlink" href="#properties" title="Permalink to this headline">¶</a></h2>
<dl class="describe">
<dt>
<tt class="descname">timeout</tt></dt>
<dd><p>Number of milliseconds to wait for a file to load before
it is considered to have failed to load.</p>
<p><em>Default:</em> 20 seconds</p>
</dd></dl>

<dl class="describe">
<dt>
<tt class="descname">STATUS.OK</tt></dt>
<dd><p>The value used to indicate that a file load has occurred
successfully.</p>
</dd></dl>

<dl class="describe">
<dt>
<tt class="descname">STATUS.ERROR</tt></dt>
<dd><p>The value used to indicate that a file load has caused an error or
a timeout to occur.</p>
</dd></dl>

<dl class="describe">
<dt>
<tt class="descname">loaded</tt></dt>
<dd><p>An object containing the names of the files that have been loaded (or
requested) so far.  <tt class="docutils literal"><span class="pre">MathJax.Ajax.loaded[&quot;file&quot;]</span></tt> will be
non-<tt class="docutils literal"><span class="pre">null</span></tt> when the file has been loaded, with the value being
the <tt class="docutils literal"><span class="pre">MathJax.Ajax.STATUS</span></tt> value of the load attempt.</p>
</dd></dl>

<dl class="describe">
<dt>
<tt class="descname">loading</tt></dt>
<dd><p>An object containing the files that are currently loading, the
callbacks that are to be run when they load or timeout, and
additional internal data.</p>
</dd></dl>

</div>
<div class="section" id="methods">
<h2>Methods<a class="headerlink" href="#methods" title="Permalink to this headline">¶</a></h2>
<dl class="method">
<dt id="Require">
<tt class="descname">Require</tt><big>(</big><em>file</em><span class="optional">[</span>, <em>callback</em><span class="optional">]</span><big>)</big><a class="headerlink" href="#Require" title="Permalink to this definition">¶</a></dt>
<dd><p>Loads the given file if it hasn&#8217;t been already. The file must be a
JavaScript file or a CSS stylesheet; i.e., it must end in <tt class="docutils literal"><span class="pre">.js</span></tt>
or <tt class="docutils literal"><span class="pre">.css</span></tt>.  Alternatively, it can be an object with a single
<cite>key:value</cite> pair where the <cite>key</cite> is one of <tt class="docutils literal"><span class="pre">js</span></tt> or <tt class="docutils literal"><span class="pre">css</span></tt> and
the <cite>value</cite> is the file of that type to be loaded (this makes it
possible to have the file be created by a CGI script, for example,
or to use a <tt class="docutils literal"><span class="pre">data::</span></tt> URL).  The file must be relative to the
MathJax home directory and can not contain <tt class="docutils literal"><span class="pre">../</span></tt> file path
components.</p>
<p>When the file is completely loaded and run, the <cite>callback</cite>, if
provided, will be executed passing it the status of the file load.
If there was an error while loading the file, or if the file fails
to load within the time limit given by <tt class="docutils literal"><span class="pre">MathJax.Ajax.timout</span></tt>,
the status will be <tt class="docutils literal"><span class="pre">MathJax.Ajax.STATUS.ERROR</span></tt> otherwise it
will be <tt class="docutils literal"><span class="pre">MathJax.Ajax.STATUS.OK</span></tt>.  If the file is already
loaded, the callback will be called immediately and the file will
not be loaded again.</p>
<table class="docutils field-list" frame="void" rules="none">
<col class="field-name" />
<col class="field-body" />
<tbody valign="top">
<tr class="field"><th class="field-name">Parameters :</th><td class="field-body"><ul class="first simple">
<li><strong>file</strong> &#8212; name of the file to be loaded</li>
<li><strong>callback</strong> &#8212; the callback specification</li>
</ul>
</td>
</tr>
<tr class="field"><th class="field-name">Returns :</th><td class="field-body"><p class="first last">the callback object</p>
</td>
</tr>
</tbody>
</table>
</dd></dl>

<dl class="method">
<dt id="Load">
<tt class="descname">Load</tt><big>(</big><em>file</em><span class="optional">[</span>, <em>callback</em><span class="optional">]</span><big>)</big><a class="headerlink" href="#Load" title="Permalink to this definition">¶</a></dt>
<dd><p>Used internally to load a given file without checking if it
already has been loaded, or where it is to be found.</p>
<table class="docutils field-list" frame="void" rules="none">
<col class="field-name" />
<col class="field-body" />
<tbody valign="top">
<tr class="field"><th class="field-name">Parameters :</th><td class="field-body"><ul class="first simple">
<li><strong>file</strong> &#8212; name of the file to be loaded</li>
<li><strong>callback</strong> &#8212; the callback specification</li>
</ul>
</td>
</tr>
<tr class="field"><th class="field-name">Returns :</th><td class="field-body"><p class="first last">the callback object</p>
</td>
</tr>
</tbody>
</table>
</dd></dl>

<dl class="method">
<dt id="loadComplete">
<tt class="descname">loadComplete</tt><big>(</big><em>file</em><big>)</big><a class="headerlink" href="#loadComplete" title="Permalink to this definition">¶</a></dt>
<dd><p>Called from within the loaded files to inform MathJax that the
file has been completely loaded and initialized.  The <cite>file</cite>
parameter is the name of the file that has been loaded.  This
routine will cause any callback functions registered for the file
or included in the :meth:<tt class="docutils literal"><span class="pre">MathJax.Ajax.Require()</span></tt> calls to be
executed, passing them the status or the load
(<cite>MathJax.Ajax.STATUS.OK`</cite> or <tt class="docutils literal"><span class="pre">MathJax.Ajax.STATUS.ERROR</span></tt>) as
their last parameter.</p>
<table class="docutils field-list" frame="void" rules="none">
<col class="field-name" />
<col class="field-body" />
<tbody valign="top">
<tr class="field"><th class="field-name">Parameters :</th><td class="field-body"><ul class="first simple">
<li><strong>file</strong> &#8212; name of the file that has been loaded</li>
</ul>
</td>
</tr>
<tr class="field"><th class="field-name">Returns :</th><td class="field-body"><p class="first last"><tt class="docutils literal"><span class="pre">null</span></tt></p>
</td>
</tr>
</tbody>
</table>
</dd></dl>

<dl class="method">
<dt id="loadTimeout">
<tt class="descname">loadTimeout</tt><big>(</big><em>file</em><big>)</big><a class="headerlink" href="#loadTimeout" title="Permalink to this definition">¶</a></dt>
<dd><p>Called when the timeout period is over and the file hasn&#8217;t loaded.
This indicates an error condition, and the
<tt class="xref py py-meth docutils literal"><span class="pre">MathJax.Ajax.loadError()</span></tt> method will be executed, then the
file&#8217;s callback will be run with <tt class="docutils literal"><span class="pre">MathJax.Ajax.STATUS.ERROR</span></tt> as
its parameter.</p>
<table class="docutils field-list" frame="void" rules="none">
<col class="field-name" />
<col class="field-body" />
<tbody valign="top">
<tr class="field"><th class="field-name">Parameters :</th><td class="field-body"><ul class="first simple">
<li><strong>file</strong> &#8212; name of the file that timed out</li>
</ul>
</td>
</tr>
<tr class="field"><th class="field-name">Returns :</th><td class="field-body"><p class="first last"><tt class="docutils literal"><span class="pre">null</span></tt></p>
</td>
</tr>
</tbody>
</table>
</dd></dl>

<dl class="method">
<dt id="loadError">
<tt class="descname">loadError</tt><big>(</big><em>file</em><big>)</big><a class="headerlink" href="#loadError" title="Permalink to this definition">¶</a></dt>
<dd><p>The default error handler called when a file fails to load.  It
puts a warning message into the MathJax message box on screen.</p>
<table class="docutils field-list" frame="void" rules="none">
<col class="field-name" />
<col class="field-body" />
<tbody valign="top">
<tr class="field"><th class="field-name">Parameters :</th><td class="field-body"><ul class="first simple">
<li><strong>file</strong> &#8212; the name of the file that failed to load</li>
</ul>
</td>
</tr>
<tr class="field"><th class="field-name">Returns :</th><td class="field-body"><p class="first last"><tt class="docutils literal"><span class="pre">null</span></tt></p>
</td>
</tr>
</tbody>
</table>
</dd></dl>

<dl class="method">
<dt id="loadHook">
<tt class="descname">loadHook</tt><big>(</big><em>file</em>, <em>callback</em><big>)</big><a class="headerlink" href="#loadHook" title="Permalink to this definition">¶</a></dt>
<dd><p>Registers a callback to be executed when the given file is
loaded.  The file load operation need to be started when this
method is called, so it can be used to register a hook for a file
that may be loaded in the future.</p>
<table class="docutils field-list" frame="void" rules="none">
<col class="field-name" />
<col class="field-body" />
<tbody valign="top">
<tr class="field"><th class="field-name">Parameters :</th><td class="field-body"><ul class="first simple">
<li><strong>file</strong> &#8212; the name of the file to wait for</li>
<li><strong>callback</strong> &#8212; the callback specification</li>
</ul>
</td>
</tr>
<tr class="field"><th class="field-name">Returns :</th><td class="field-body"><p class="first last">the callback object</p>
</td>
</tr>
</tbody>
</table>
</dd></dl>

<dl class="method">
<dt id="Styles">
<tt class="descname">Styles</tt><big>(</big><em>styles</em><span class="optional">[</span>, <em>callback</em><span class="optional">]</span><big>)</big><a class="headerlink" href="#Styles" title="Permalink to this definition">¶</a></dt>
<dd><p>Creates a stylesheet from the given style data. <cite>styles</cite> can
either be a string containing a stylesheet definition, or an
object containing a <a class="reference internal" href="../CSS-styles.html#css-style-objects"><em>CSS Style Object</em></a>.
For example:</p>
<div class="highlight-javascript"><div class="highlight"><pre><span class="nx">MathJax</span><span class="p">.</span><span class="nx">Ajax</span><span class="p">.</span><span class="nx">Styles</span><span class="p">(</span><span class="s2">&quot;body {font-family: serif; font-style: italic}&quot;</span><span class="p">);</span>
</pre></div>
</div>
<p>and</p>
<div class="highlight-javascript"><div class="highlight"><pre><span class="nx">MathJax</span><span class="p">.</span><span class="nx">Ajax</span><span class="p">.</span><span class="nx">Styles</span><span class="p">({</span>
  <span class="nx">body</span><span class="o">:</span> <span class="p">{</span>
    <span class="s2">&quot;font-family&quot;</span><span class="o">:</span> <span class="s2">&quot;serif&quot;</span><span class="p">,</span>
    <span class="s2">&quot;font-style&quot;</span><span class="o">:</span>  <span class="s2">&quot;italic&quot;</span>
  <span class="p">}</span>
<span class="p">});</span>
</pre></div>
</div>
<p>both set the body font family and style.</p>
<p>The callback routine is called when the stylesheet has been
created and is available for use.</p>
<table class="docutils field-list" frame="void" rules="none">
<col class="field-name" />
<col class="field-body" />
<tbody valign="top">
<tr class="field"><th class="field-name">Parameters :</th><td class="field-body"><ul class="first simple">
<li><strong>styles</strong> &#8212; CSS style object for the styles to set</li>
<li><strong>callback</strong> &#8212; the callback specification</li>
</ul>
</td>
</tr>
<tr class="field"><th class="field-name">Returns :</th><td class="field-body"><p class="first last">the callback object</p>
</td>
</tr>
</tbody>
</table>
<div class="admonition note">
<p class="first admonition-title">Note</p>
<p class="last">Internet Explorer has a limit of 32 dynamically created
stylesheets, so it is best to combine your styles into one
large group rather than making several smaller calls.</p>
</div>
</dd></dl>

<dl class="method">
<dt id="fileURL">
<tt class="descname">fileURL</tt><big>(</big><em>file</em><big>)</big><a class="headerlink" href="#fileURL" title="Permalink to this definition">¶</a></dt>
<dd><p>Returns a complete URL to a file (replacing <tt class="docutils literal"><span class="pre">[MathJax]</span></tt> with the
actual root URL location).</p>
<table class="docutils field-list" frame="void" rules="none">
<col class="field-name" />
<col class="field-body" />
<tbody valign="top">
<tr class="field"><th class="field-name">Parameters :</th><td class="field-body"><ul class="first simple">
<li><strong>file</strong> &#8212; the file name possibly including <tt class="docutils literal"><span class="pre">[MathJax]</span></tt></li>
</ul>
</td>
</tr>
<tr class="field"><th class="field-name">Returns :</th><td class="field-body"><p class="first last">the full URL for the file</p>
</td>
</tr>
</tbody>
</table>
</dd></dl>

</div>
</div>


          </div>
        </div>
      </div>
      <div class="sphinxsidebar">
        <div class="sphinxsidebarwrapper">
  <h3><a href="../index.html">Table Of Contents</a></h3>
  <ul>
<li><a class="reference internal" href="#">The MathJax.Ajax Object</a><ul>
<li><a class="reference internal" href="#properties">Properties</a></li>
<li><a class="reference internal" href="#methods">Methods</a></li>
</ul>
</li>
</ul>

  <h4>Previous topic</h4>
  <p class="topless"><a href="hub.html"
                        title="previous chapter">The MathJax.Hub Object</a></p>
  <h4>Next topic</h4>
  <p class="topless"><a href="message.html"
                        title="next chapter">The MathJax.Message Object</a></p>
  <h3>This Page</h3>
  <ul class="this-page-menu">
    <li><a href="../_sources/api/ajax.txt"
           rel="nofollow">Show Source</a></li>
  </ul>
<div id="searchbox" style="display: none">
  <h3>Quick search</h3>
    <form class="search" action="../search.html" method="get">
      <input type="text" name="q" size="18" />
      <input type="submit" value="Go" />
      <input type="hidden" name="check_keywords" value="yes" />
      <input type="hidden" name="area" value="default" />
    </form>
    <p class="searchtip" style="font-size: 90%">
    Enter search terms or a module, class or function name.
    </p>
</div>
<script type="text/javascript">$('#searchbox').show(0);</script>
        </div>
      </div>
      <div class="clearer"></div>
    </div>
    <div class="related">
      <h3>Navigation</h3>
      <ul>
        <li class="right" style="margin-right: 10px">
          <a href="../genindex.html" title="General Index"
             >index</a></li>
        <li class="right" >
          <a href="message.html" title="The MathJax.Message Object"
             >next</a> |</li>
        <li class="right" >
          <a href="hub.html" title="The MathJax.Hub Object"
             >previous</a> |</li>
        <li><a href="../index.html">MathJax v1.0 documentation</a> &raquo;</li>
          <li><a href="index.html" >The MathJax API</a> &raquo;</li> 
      </ul>
    </div>
    <div class="footer">
        &copy; Copyright 2010 Design Science.
      Created using <a href="http://sphinx.pocoo.org/">Sphinx</a> 1.0.4.
    </div>
  </body>
</html>